body { background: linear-gradient(to right, #6a82fb, #fc5c7d); font-family: Arial, sans-serif; }
.container { background: white; width: 350px; margin: 100px auto; padding: 25px; border-radius: 8px; box-shadow: 0 0 8px rgba(0,0,0,0.2); }
h1 { text-align:center; color:#444; }
label { display:block; margin-top:10px; font-weight:bold; }
input { width:100%; padding:8px; margin-top:5px; border:1px solid #ccc; border-radius:4px; }
button { width:100%; padding:10px; margin-top:15px; background-color:#28a745; border:none; color:white; font-size:16px; border-radius:4px; cursor:pointer; transition: all 0.3s ease; }
button:hover { background-color:#218838; }
button:disabled { background-color:#6c757d; cursor: not-allowed; }

/* Message Container Styles */
.message {
  padding: 15px;
  margin-bottom: 20px;
  border-radius: 8px;
  font-weight: 600;
  text-align: center;
  animation: slideDown 0.3s ease;
}

.message.success {
  background: linear-gradient(135deg, #d4edda 0%, #c3e6cb 100%);
  color: #155724;
  border: 2px solid #c3e6cb;
}

.message.error {
  background: linear-gradient(135deg, #f8d7da 0%, #f5c6cb 100%);
  color: #721c24;
  border: 2px solid #f5c6cb;
}

@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}